import {createRouter, createWebHashHistory} from "vue-router"
import {ElMessage} from "element-plus"
import store from "../store"


const routes = [{
    path: "/login",
    name: 'login',
    component: () => import('@/views/login.vue')
},
    {path: "/alipay",name: 'alipay',component: () => import('@/views/shopping/order/Alipay.vue')},
    {

        path: '/',
        name: 'home',
        redirect: '/welcome',
        component: () => import('@/views/Header.vue'),
        children: [
            {path: "welcome",name: "shoppingWelcome",component: () => import('@/views/shopping/Show.vue')},
            {path: "registration",name: "registration",component: () => import('@/views/usr/Registration.vue')},
            {path: "/usr/welcome",name: "Usr_Welcome",component: () => import('@/views/usr/Welcome.vue'),children: [
                    {path: "pwd",name: 'usrpwd',component: () => import('@/views/usr/Pwd.vue')},
                    {path: "avatar",name: 'usravatar',component: () => import('@/views/usr/Avatar.vue')},
                    {path: "setting",name: 'usrsetting',component: () => import('@/views/usr/Setting.vue')},
                    {path: "comment",name: 'usrcomment',component: () => import('@/views/usr/Comment.vue')}]},
            {
                path: "/info",
                children:[
                    {path: "book", name: "book", component: () => import('@/views/shopping/Book.vue')},
                    {path: "books", name: "books", component: () => import('@/views/shopping/Books.vue')},
                    {path: "shoppingcart", name: "myCart", component: () => import('@/views/shopping/MyCar.vue')},
                    {path: "building", name: "building", component: () => import('@/views/shopping/order/Building.vue')},
                    {path: "orderInfo", name: "orderinfo", component: () => import('@/views/shopping/order/Info.vue')},
                    {path: "payment", name: "payment", component: () => import('@/views/shopping/order/Payment.vue')}
                ]
            },
        ]
    },
    {path: '/adm/index', name: 'admIndex', component: () => import('@/views/adm/Index.vue')},
    {
        path: `/adm`,
        name: 'adm',
        redirect: '/adm/index',
        component: () => import('@/views/adm/Welcome.vue'),
        children: [
            {path: 'hot/list', name: 'hotlist', component: () => import('@/views/adm/hot/List.vue')},
            {path: `hot/edit`, name: 'hotedit', component: () => import('@/views/adm/hot/edit.vue')},
            {path: 'type/list', name: 'typAdd1', component: () => import('@/views/adm/type/TypAdd1.vue')},
            {path: 'type/edit', name: 'typEdit1', component: () => import('@/views/adm/type/TypEdit1.vue')},
            {path: 'type2/list', name: 'typAdd2', component: () => import('@/views/adm/type/TypeAdd2.vue')},
            {path: 'type2/edit', name: 'typEdit2', component: () => import('@/views/adm/type/TypeEdit2.vue')},
            {path: 'book/list', name: 'bookList', component: () => import('@/views/adm/book/List.vue')},
            {path: 'book/edit', name: 'bookEdit', component: () => import('@/views/adm/book/Edit.vue')},
            {path: 'order/list', name: 'orderList', component: () => import('@/views/adm/order/List.vue')},
            {path: 'order/shipGoods', name: 'orderEdit', component: () => import('@/views/adm/order/Edit.vue')},
            {path: 'user/edit', name: 'userEdit', component: () => import('@/views/adm/user/Edit.vue')},
            {path: 'user/list', name: 'userList', component: () => import('@/views/adm/user/List.vue')}

        ]
    }
]

const router = createRouter({
    history: createWebHashHistory(import.meta.env.BASE_URL),
    routes
})

router.beforeEach((to, from, next) => {
    // 假设我们通过 localStorage 中的 token 来判断用户是否登录

    const allowPages = ['login', 'shoppingWelcome', 'registration'];
    console.log("to.name: " + to.name);
    // 允许访问的页面，无需登录
    if (allowPages.includes(to.name)) {
        next();
        return;
    }else if (!localStorage.getItem('token')) {
        // 如果用户未登录且目标路由不是登录页以及首页，重定向到登录页
        ElMessage.warning({
            message: "用户未登录，请先登录",
            center: true
        })
        next({
            name: 'login'
        });
    }

    // 用户已登录，进行权限检查
    const userRole = store.state.user.role;
    if (userRole) {
        if (userRole === 'usr' && to.path.startsWith('/adm')) {
            // 用户角色为 usr 且目标路由以 /adm 开头，禁止访问
            ElMessage.warning({
                message: "您没有权限访问该页面",
                center: true
            });
            next({ name: 'home' });
            return;
        } else if (userRole === 'adm' && (to.path.startsWith('/info') || to.path.startsWith('/usr'))) {
            // 用户角色为 adm 且目标路由非 /adm 开头，禁止访问
            ElMessage.warning({
                message: "您没有权限访问该页面",
                center: true
            });
            next({ name: 'home' });
            return;
        }
    }

    // 用户已登录且权限检查通过，正常放行
    next();

})

export default router